<template>
    <el-dialog title="查看资料" :visible.sync="dialogFormVisible" append-to-body width="60%">
       <div v-loading="loading">
           <div>
               <p class="subtitle">待补充资料</p>
               <div>
                   <el-table :data="list" border>
                       <el-table-column
                           prop="fileName"
                           label="待补充资料"
                           align="center"
                           show-overflow-tooltip>
                       </el-table-column>
                       <el-table-column
                           prop="fileName"
                           label="是否需要担保人"
                           align="center"
                           show-overflow-tooltip>
                           <template v-slot="{row}">
                               {{row.needGuarantor|needGuarantor}}
                           </template>
                       </el-table-column>
                   </el-table>
               </div>
           </div>
           <div v-if="detailInfo.guarantors && detailInfo.guarantors.length>0">
               <p class="subtitle">担保人信息</p>
               <div>
                  <GuarantorsEcho  :guarantors="detailInfo.guarantors"></GuarantorsEcho>
               </div>
           </div>
           <div>
               <p class="subtitle">上传资料</p>
               <el-form label-width="80px">
                   <el-form-item label="附件:">
                       <image-common disabled info="补充资料" :limit="100" v-model="detailInfo.files"></image-common>
                   </el-form-item>
                   <el-form-item label="说明:">
                       {{detailInfo.remark||'--'}}
                   </el-form-item>
               </el-form>
           </div>
       </div>
    </el-dialog>
</template>

<script>
import {getAddFileInfo} from "@/api/letterReview/creditReviewApply";
import GuarantorsEcho from "@/views/letterReview/order/components/GuarantorsEcho.vue";
export default {
    components: {GuarantorsEcho},
    props: {},
    data() {
        // 这里存放数据
        return {
            loading:false,
            dialogFormVisible:false,
            detailInfo:{},
            list:[]
        }
    },
    // 计算属性 类似于 data 概念
    computed: {

    },
    // 方法集合
    methods: {
        show(id){
            this.dialogFormVisible=true
            this.getAddFileInfo(id)
        },
        getAddFileInfo(id){
            this.loading = true
            getAddFileInfo(id).then(res=>{
                this.detailInfo = res.data;
                this.list = [{
                    fileName:this.detailInfo.fileName,
                    needGuarantor:this.detailInfo.needGuarantor

                }]
            }).finally(()=>{
                this.loading=false
            })
        },
        close(){
            this.dialogFormVisible=false
        },

    },
    // 生命周期 - 创建完成（可以访问当前this 实例）
    created() {
    },
    // 生命周期 - 挂载完成（可以访问 DOM 元素）
    mounted() {
    },

}
</script>

<style lang="scss" scoped>
@import "~@/assets/styles/variables.scss";

.subtitle{
    font-size: 14px;
    font-weight: bold;
    color: #333333;
    &::before{
        display: inline-block;
        content: '';
        width: 8px;
        height: 8px;
        border-radius: 4px;
        background-color: $primary;
        margin-right: 5px;
        position: relative;
        top: -1px;
    }
}
</style>
